<template>
    <view class="select_address_input_cp">
        <u-input 
            v-model="address" 
            type="select" 
            @click="show = true"
            placeholder="请选择住址"/>
        <u-picker 
            mode="region" 
            v-model="show" 
            :params="{
                province: true,
                city: true,
                area: true,
            }"
            @confirm="confirm"> 
        </u-picker>
    </view>
</template>

<script>
//地区选择input组件
export default {
    name:"SelectAddressInputCp",
    props:{
        value:{
            type:String,
            default:'',
        },
    },
    data() {
        return {
            show: false,
        }
    },
    computed:{
        address:{ //地区
            get(){
                return this.value;
            },
            set(value){
                this.$emit('input',value);
            },
        },
    },
    methods:{
        confirm(e) {
            this.address = e.province.label+e.city.label+e.area.label;
        }
    },
}
</script>

<style lang="scss" scoped>
.select_address_input_cp {
    text-align: center;
    width: 100%;
    /deep/.u-input{
        width: 100%;
    }
}
</style>
